<template>
  <div class="footerNav">
    <van-tabbar v-model="selectedTab" fixed route>
      <van-tabbar-item v-for="(item,i) in tabbarItems" :key="i" :icon="item.icon" :to="{name:item.routeName}">
        {{ item.title }}
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: "footerNav",
  data() {
    return {
      selectedTab: 0, //选中的TabBar
      tabbarItems: [{
        title: "首页",
        routeName: "home",
        icon: "home-o",
      },
        {
          title: "商品",
          routeName: "goodsList",
          icon: "gift-o",
        },
        {
          title: "购物车",
          routeName: "cart",
          icon: "shopping-cart-o",
        },
        {
          title: "我的",
          routeName: "user",
          icon: "user-o",
        },

      ],
    };
  },
}
</script>

<style>
</style>
